<template >
    <div class="sdy-footer">
    <van-tabbar route>
        <van-tabbar-item 
        v-for="item in barList"
        :key="item.id"
        :to="item.to" 
        :icon="item.icon">
        </van-tabbar-item>
    </van-tabbar>
    </div>
</template>
<script setup lang="ts">
// 导入一个接口限制
import type{MyBarItem} from '@/config/interface'
// 定义一个数组，循环生产底部导航
    const barList = [
    { id: 1, to: '/home', icon: 'home-o', title: '首页' },
  { id: 2, to: '/cate', icon: 'apps-o', title: '分类' },
  { id: 3, to: '/cart', icon: 'cart-o', title: '购物车' },
  { id: 4, to: '/self', icon: 'user-o', title: '我的' }
    ]
</script>
<style scoped lang="scss">

</style>